<template>
	<view class="container" style="padding-top: 10px;background-color: #fff;
			padding-bottom: 20px;">
		<view class="floor">
			<view class="title">账单号</view>
			<view class="content">
				<input type="text" placeholder="请输入账单号" v-model="dict.fee_item_id" />
			</view>
		</view>
		<view class="floor">
			<view class="title">客户姓名</view>
			<view class="content">
				<input type="text" placeholder="请输入客户姓名" v-model="dict.ownerName" />
			</view>
		</view>
		<view class="floor">
			<view class="title">楼号</view>
			<view class="content">
				<input type="text" placeholder="请输入楼号" v-model="dict.buildingName" />
			</view>
		</view>
		<view class="floor">
			<view class="title">房号</view>
			<view class="content">
				<input type="text" placeholder="请输入房号" v-model="dict.hname" />
			</view>
		</view>
		<view class="floor">
			<view class="title">选择缴费</view>
			<view class="content">
				<!-- dict.applyCategory《注释代码》 -->
				<picker @change="bindPickerChange" :value="index" :range="checkList">
					<view>{{checkList[index]}}</view>
				</picker>
			</view>
		</view>
		<view class="floor">
			<view class="title">缴费方式</view>
			<view class="content">
				<!-- dict.applyCategory《注释代码》 -->
				<picker @change="bindPickerChange1" :value="index1" v-model="dict.payState" :range="payState">
					<view>{{payState[index1]}}</view>
				</picker>
			</view>
		</view>
		<view class="floor">
			<view class="title">物业费</view>
			<view class="content">
				<input type="text" placeholder="请输入物业费" v-model="dict.priceWy" />
			</view>
		</view>
		<view class="floor">
			<view class="title">电梯费</view>
			<view class="content">
				<input type="text" placeholder="请输入电梯费" v-model="dict.priceDt" />
			</view>
		</view>
		<view class="floor">
			<view class="title">车位费</view>
			<view class="content">
				<input type="text" placeholder="请输入车位费" v-model="dict.priceTc" />
			</view>
		</view>
		<view class="floor">
			<view class="title">收款金额</view>
			<view class="content">
				<input type="text" placeholder="请输入收款金额" v-model="dict.big" />
			</view>
		</view>
		<view class="floor">
			<view class="title">发票号</view>
			<view class="content">
				<input type="text" placeholder="请输入发票号" v-model="dict.feeItemId" />
			</view>
		</view>
		<view class="floor">
			<view class="title">合计</view>
			<view class="content">
				<input type="text" placeholder="请输入合计" v-model="dict.total" />
			</view>
		</view>
		<button type="primary" style="width: 80%;margin: 20px auto;" @click="sendInfo();">提交</button>
	</view>
</template>

<script>
	import config from '@/config/config.js'
	import {
		insertConfigPaymentBillBlock,
		fileUpload
	} from "@/api/home.js"
	export default {
		data() {
			return {
				picList: [],
				dict: {},
				checkList: ['物业费', '电梯费', '车位费'],
				payState: ['现金', '刷卡', '建行码','转账'],
				index: 0,
				index1: 0
			}
		},
		methods: {
			bindPickerChange: function(e) {
				console.log('picker发送选择改变，携带值为', e.detail.value)
				this.index = e.detail.value
			},
			bindPickerChange1: function(e) {
				console.log('picker发送选择改变，携带值为', e.detail.value)
				this.index1 = e.detail.value
			},
			sendInfo() {
				this.dict.applyCategory = this.checkList[this.index]
				this.dict.state = "选择缴费";
				this.dict.client = "小程序";
				this.dict.applyImg = this.picList.join(",");
				insertConfigPaymentBillBlock({
					...this.dict
				}).then(res => {
					if (res.code == 200) {
						uni.showToast({
							title: "操作成功",
							icon: "none",
							duration:1000,
							success() {
								uni.navigateBack({
									delta:1
								})
							}
						})
					} else {
						uni.showToast({
							title: "操作失败",
							icon: "none"
						})
					}
				}).catch(err => {
					uni.showToast({
						title: "网络异常",
						icon: "none"
					})
				})
			},
			deleteIt(item, index) {
				var that = this;
				uni.showModal({
					title: "提示",
					content: "是否确认删除",
					success(res) {
						if (res.confirm == true) {
							that.picList.splice(index, 1)
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	uni-input {
		height: 70rpx !important;
		line-height: 70rpx !important;
	}

	.floor {
		width: 100%;
		overflow: hidden;
		margin-bottom: 5px;

		.title {
			float: left;
			width: 120px;
			line-height: 70rpx;
			text-align: center;
			font-size: 28rpx;
			color: #666666;
			background-color: #fff;
		}

		.content {
			float: left;
			width: calc(100% - 130px);
			height: 70rpx;
			line-height: 70rpx;
			border-bottom: 1px solid #ccc;

			uni-button {
				width: 50px;
				height: 50px;
				display: block;
				float: left;
				margin: 10px;
			}

			uni-image {
				width: 50px;
				height: 50px;
				display: block;
				float: left;
				margin: 10px;
			}
		}
	}
</style>